<!--
* @description 交易所类别
* @fileName category.vue
* @author huangyu
* @date 2023/02/07 15:27:30
!-->
<template>
    <div  :style="`min-height:500px;background:#fff;`">
        <el-tree :data="data" :props="defaultProps" highlight-current @node-click="handleNodeClick"></el-tree>
    </div>
</template>

<script>
import { get } from '@/common/app.js'
export default {
    components: {},
    data() {
        return {
            menuHeight: document.documentElement.clientHeight - 100,
            data: [],
            defaultProps: {
                children: 'children',
                label: 'label'
            }
        }
    },
    mounted() {
        this.getData()
    },
    methods: {
        handleNodeClick(data,node) {
            let id = data.value?data.value:""
            let parentId = node.parent.data.value?node.parent.data.value:""

            // childNodesLength=0 代表最后一级
            let childNodesLength = node.childNodes.length

            // 1、最后一级包含id的数据，返回父级
            // 2、全部数据，返回父级
            if((id&&childNodesLength==0)||id=='all'){
                if(id == 'all')
                    id = ""
                this.$emit("change",{id:id,parentId:parentId,})
            }
        },
        getData() {
            let params = {
                type: 'getCategory',
                data: {},
            }
            get('game', params).then(res => {
                if (res) {
                    this.data = res.data
                    // 最前面插入 全部的数据
                    let unshiftArr = {label: "全部",value: "all"}
                    this.data.unshift(unshiftArr)
                    // console.log(this.data)
                }
            })
        }
    },
}
</script>

<style scoped>

</style>